<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@include file="common/head.jsp" %>
<style type="text/css">
    .pagination {
        overflow: hidden;
        margin: 0;
        padding: 10px 10px 6px 10px;
        border-top: 1px solid #f60;
        _zoom: 1;
    }

    .pagination * {
        display: inline;
        float: left;
        margin: 0;
        padding: 0;
        font-size: 12px;
    }

    .pagination i {
        float: none;
        padding-right: 1px;
    }

    .currentPage b {
        float: none;
        color: #f00;
    }

    .pagination li {
        list-style: none;
        margin: 0 5px;
    }

    .pagination li li {
        position: relative;
        margin: -2px 0 0;
        font-family: Arial, Helvetica, sans-serif
    }

    .firstPage a, .previousPage a, .nextPage a, .lastPage a {
        overflow: hidden;
        height: 0;
        text-indent: -9999em;
        border-top: 8px solid #fff;
        border-bottom: 8px solid #fff;
    }

    .pagination li li a {
        margin: 0 1px;
        padding: 0 4px;
        border: 3px double #fff;
    + border-color: #eee;
        background: #eee;
        color: #06f;
        text-decoration: none;
    }

    .pagination li li a:hover {
        background: #f60;
        border-color: #fff;
    + border-color: #f60;
        color: #fff;
    }

    li.firstPage {
        margin-left: 40px;
        border-left: 3px solid #06f;
    }

    .firstPage a, .previousPage a {
        border-right: 12px solid #06f;
    }

    .firstPage a:hover, .previousPage a:hover {
        border-right-color: #f60;
    }

    .nextPage a, .lastPage a {
        border-left: 12px solid #06f;
    }

    .nextPage a:hover, .lastPage a:hover {
        border-left-color: #f60;
    }

    li.lastPage {
        border-right: 3px solid #06f;
    }

    li li.currentState a {
        position: relative;
        margin: -1px 3px;
        padding: 1px 4px;
        border: 3px double #fff;
    + border-color: #f60;
        background: #f60;
        color: #fff;
    }

    li.currentState, .currentState a, .currentState a:hover {
        border-color: #fff #ccc;
        cursor: default;
    }
</style>

<div class="right" id="right">
    <div class="location">
        <strong>你现在所在的位置是:</strong>
        <span>订单管理页面</span>
    </div>
    <div class="search" style="float: left;">
        <form method="get" action="${pageContext.request.contextPath }/bill/getlist">
            <input name="method" value="query" class="input-text" type="hidden">
            <span>商品名称：</span>
            <input name="queryProductName" type="text" value="${queryProductName }">

            <span>供应商：</span>
            <select name="queryProviderId">
                <c:if test="${providerList != null }">
                    <option value="0">--请选择--</option>
                    <c:forEach var="provider" items="${providerList}">
                        <option
                                <c:if test="${provider.id == queryProviderId }">selected="selected"</c:if>
                                value="${provider.id}">${provider.proName}</option>
                    </c:forEach>
                </c:if>
            </select>

            <span>是否付款：</span>
            <select name="queryIsPayment">
                <option value="0">--请选择--</option>
                <option value="1" ${queryIsPayment == 1 ? "selected=\"selected\"":"" }>未付款</option>
                <option value="2" ${queryIsPayment == 2 ? "selected=\"selected\"":"" }>已付款</option>
            </select>

            <input value="查 询" type="submit" id="searchbutton">
            <a id="add" style="cursor: pointer">添加订单</a>
        </form>
    </div>
    <ol>
        <li>总条数为:${pageInfo.total}</li>
        <li>总页数:${pageInfo.pages}</li>
        <li>当前页码:${pageInfo.pageNum}</li>
        <li>页码大小:${pageInfo.pageSize}</li>
    </ol>
    <!--账单表格 样式和供应商公用-->
    <table class="providerTable" cellpadding="0" cellspacing="0">
        <tr class="firstTr">
            <th width="10%">订单编码</th>
            <th width="20%">商品名称</th>
            <th width="10%">供应商</th>
            <th width="10%">订单金额</th>
            <th width="10%">是否付款</th>
            <th width="10%">创建时间</th>
            <th width="30%">操作</th>
        </tr>
        <c:forEach var="bill" items="${pageInfo.list}" varStatus="status">
            <tr>
                <td>
                    <span>${bill.billCode }</span>
                </td>
                <td>
                    <span>${bill.productName }</span>
                </td>
                <td>
                    <span>${bill.providerName}</span>
                </td>
                <td>
                    <span>${bill.totalPrice}</span>
                </td>
                <td>
					<span>
						<c:if test="${bill.isPayment == 1}">未付款</c:if>
						<c:if test="${bill.isPayment == 2}">已付款</c:if>
					</span>
                </td>
                <td>
					<span>
					<fmt:formatDate value="${bill.creationDate}" pattern="yyyy-MM-dd"/>
					</span>
                </td>
                <td>
                    <span><a class="viewBill" href="javascript:;" billid=${bill.id } billcc=${bill.billCode }><img
                            src="${pageContext.request.contextPath }/statics/images/read.png" alt="查看" title="查看"/></a></span>
                    <span><a class="modifyBill" href="javascript:;" billid=${bill.id } billcc=${bill.billCode }><img
                            src="${pageContext.request.contextPath }/statics/images/xiugai.png" alt="修改"
                            title="修改"/></a></span>
                    <span><a class="deleteBill" href="javascript:;" billid=${bill.id } billcc=${bill.billCode }><img
                            src="${pageContext.request.contextPath }/statics/images/schu.png" alt="删除" title="删除"/></a></span>
                </td>
            </tr>
        </c:forEach>
    </table>
    <ul class="pagination">
        <li class="totalAnnal">总记录数：<i>${pageInfo.total}</i></li>
        <li class="totalPage">总页数：<i>${pageInfo.pages}</i></li>
        <li class="currentPage">当前页：<b>${pageInfo.pageNum}</b></li>
        <c:choose>
            <c:when test="${pageInfo.pageNum==1}">

            </c:when>
            <c:otherwise>
                <li class="previousPage">
                    <a href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${pageInfo.pageNum-1}"><span
                            class="page-link">上一页</span></a>
                </li>
            </c:otherwise>
        </c:choose>
        <li>
            <ol>
                <c:choose>
                    <c:when test="${pageInfo.pages<=10}">
                        <c:forEach begin="1" end="${pageInfo.pages}" var="c">
                            <c:choose>
                                <c:when test="${c==pageInfo.pageNum}">
                                    <li class="currentState"><a class="page-link"
                                                                href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                    </li>
                                </c:when>
                                <c:otherwise>
                                    <li class=""><a class="page-link"
                                                    href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                    </li>
                                </c:otherwise>
                            </c:choose>
                        </c:forEach>
                    </c:when>
                    <c:otherwise>
                        <c:choose>
                            <c:when test="${pageInfo.pageNum<6}">
                                <c:forEach begin="1" end="10" var="c">
                                    <c:choose>
                                        <c:when test="${c==pageInfo.pageNum}">
                                            <li class="currentState"><a class="page-link"
                                                                        href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                            </li>
                                        </c:when>
                                        <c:otherwise>
                                            <li class=""><a class="page-link"
                                                            href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                            </li>
                                        </c:otherwise>
                                    </c:choose>
                                </c:forEach>
                            </c:when>
                            <c:otherwise>
                                <c:forEach begin="${pageInfo.pageNum-4}" end="${pageInfo.pageNum+4}" var="c">

                                    <c:choose>
                                        <c:when test="${c<=pageInfo.pages}">
                                            <c:choose>
                                                <c:when test="${c==pageInfo.pageNum}">
                                                    <li class="currentState"><a class="page-link"
                                                                                href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                                    </li>
                                                </c:when>
                                                <c:otherwise>
                                                    <li class=""><a class="page-link"
                                                                    href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${c}">${c}</a>
                                                    </li>
                                                </c:otherwise>
                                            </c:choose>
                                        </c:when>
                                        <c:otherwise>

                                        </c:otherwise>
                                    </c:choose>

                                </c:forEach>
                            </c:otherwise>
                        </c:choose>
                    </c:otherwise>
                </c:choose>
            </ol>
        </li>
        <c:choose>
            <c:when test="${pageInfo.pageNum<pageInfo.pages}">
                <li class="nextPage">
                    <a href="/bill/getlist?queryProductName=${queryProductName}&queryProviderId=${queryProviderId}&queryIsPayment=${queryIsPayment}&pageNum=${pageInfo.pageNum+1}"><span
                            class="page-link">下一页</span></a>
                </li>
            </c:when>
            <c:otherwise>

            </c:otherwise>
        </c:choose>
    </ul>
    <div class="providerView" id="providerView">
        <p><strong>订单编号：</strong><span id="_billCode"></span></p>
        <p><strong>商品名称：</strong><span id="_productName"></span></p>
        <p><strong>商品描述：</strong><span id="_productDesc"></span></p>
        <p><strong>商品单位：</strong><span id="_productUnit"></span></p>
        <p><strong>商品数量：</strong><span id="_productCount"></span></p>
        <p><strong>总金额：</strong><span id="_totalPrice"></span></p>
        <p><strong>供应商：</strong><span id="_providerName"></span></p>
        <p><strong>是否付款：</strong>
            <span id="_isPayment">

			</span>
        </p>
        <p><strong>图片: </strong><span><img id="_idPicPath"/></span></p>
    </div>
</div>
</div>
</section>

<!--点击删除按钮后弹出的页面-->
<div class="zhezhao"></div>
<div class="remove" id="removeBi">
    <div class="removerChid">
        <h2>提示</h2>
        <div class="removeMain">
            <p>你确定要删除该订单吗？</p>
            <a href="#" id="yes">确定</a>
            <a href="#" id="no">取消</a>
        </div>
    </div>
</div>

<%@include file="common/foot.jsp" %>
<script type="text/javascript" src="${pageContext.request.contextPath }/statics/js/billlist.js"></script>